<template>
  <div class="reviewed">
    <el-card>
      <div class="itemBox">
        <p>
          <span>举报序号</span>
          <el-input
            v-model="list.id"
            placeholder="举报序号"
            disabled
          ></el-input>
        </p>
        <p>
          <span>举报时间</span>
          <el-input
            v-model="list.reportTime"
            placeholder="举报时间"
            disabled
          ></el-input>
        </p>
      </div>
      <div class="itemBox">
        <p>
          <span>举报人ID</span>
          <el-input
            v-model="list.userId"
            placeholder="举报人ID"
            disabled
          ></el-input>
        </p>
        <p>
          <span>举报人</span>
          <el-input
            v-model="list.userName"
            placeholder="举报人"
            disabled
          ></el-input>
        </p>
      </div>
      <div class="itemBox">
        <p>
          <span>被举报人ID</span>
          <el-input
            v-model="list.reportUserId"
            placeholder="被举报人ID"
            disabled
          ></el-input>
        </p>
        <p>
          <span>被举报人</span>
          <el-input
            v-model="list.reportUserName"
            placeholder="被举报人"
            disabled
          ></el-input>
        </p>
      </div>
      <div class="itemBox">
        <p>
          <span class="span">举报内容</span>
          <span class="dialogSpan">{{ list.describes }}</span>
        </p>
      </div>
      <div class="itemBox">
        <p>
          <img
            v-for="(item, index) in list.picture"
            :key="index"
            class="img"
            :src="item"
            alt=""
          />
        </p>
      </div>

      <div class="itemBox">
        <p>
          <span class="span">违规判定</span>
          <el-radio v-model="list.result" label="用户违规" disabled
            >用户违规</el-radio
          >
          <el-radio v-model="list.result" label="用户未违规" disabled
            >用户未违规</el-radio
          >
        </p>
      </div>
      <!-- <div class="itemBox">
        <p>
          <span class="span">违规判定</span>
          <el-radio v-model="radio" label="1" disabled>用户违规</el-radio>
        </p>
      </div> -->
      <!-- <div class="itemBox">
        <p>
          <span>举报处理</span>
          <el-input v-model="input" placeholder="已封禁"></el-input>
        </p>
      </div> -->
      <div class="itemBox" v-show="list.result !== '用户未违规'">
        <p>
          <span class="span">封禁功能</span>
          <el-checkbox-group v-model="list.banType" disabled>
            <el-checkbox label="1">封禁账号</el-checkbox>
          </el-checkbox-group>
        </p>
      </div>
      <div class="itemBox" v-show="list.result !== '用户未违规'">
        <p>
          <span>解封时间</span>
          <el-input
            v-model="list.banDays"
            placeholder="解封时间"
            disabled
          ></el-input>
        </p>
      </div>
      <div class="itemBox" v-show="list.result !== '用户未违规'">
        <p>
          <span>封禁原因</span>
          <el-input
            v-model="list.banReason"
            placeholder="其他"
            disabled
          ></el-input>
        </p>
      </div>
      <el-button @click="returnBtn">返 回</el-button>
    </el-card>
  </div>
</template>

<script>
export default {
  data() {
    return {
      radio: "1",
      list: [],

      id: "", //序号
      reportTime: "", //举报时间
      userId: "", //举报人id
      userName: "", //举报人名称
      describes: "", //举报内容
      picture: [], //图片数组
      result: "", //审核类型 1.用户未违规 2.用户违规
      reportUserId: "", //被举报人id
      reportUserName: "", //被举报人姓名
      banReason: "", //封禁原因
      banType: [], //封禁类型 0未封禁 1.封禁账号 2.封禁匹配 3.封禁预约
      banDays: "", //封禁天数
      dealTime: "", //处理时间
    };
  },
  methods: {
    returnBtn() {
      this.$router.push("/AuditManagement/ReportReview");
    },
  },
  created() {
    this.list = JSON.parse(localStorage.getItem("reviewed"));
  },
};
</script>

<style lang="less" scoped>
.reviewed {
  margin: 30px;
  height: 100%;
  .itemBox {
    display: flex;
    p {
      display: flex;
      span {
        width: 120px;
        line-height: 40px;
        text-align: right;
      }
      .dialogSpan {
        display: inline-block;
        text-align: left;
        margin-left: 10px;
      }
      .el-input {
        margin-left: 10px;
      }
      .span {
        width: 80px;
      }
      .img {
        width: 80px;
        height: 80px;
        margin-left: 90px;
      }
      .el-radio,
      .el-checkbox-group {
        line-height: 40px;
        margin-left: 10px;
      }
    }
  }
}
</style>